<!doctype html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	{{--<meta name="viewport" content="width=device-width, initial-scale=1">--}}
	<title>央票通</title>
	<link rel="stylesheet" href="./resource/css/login.css">
</head>
<body>
<!-- head -->
<div class="head">
	<div class="main">
		<div class="logo">
			<a href="/index.php"><img src="./resource/img/logo.png" alt=""></a>
		</div>
		<div class="ul">
			<ul>
				<li class="active"><a href="/index.php">首页</a></li>
				<li class="app"><a href="javascript:;">APP下载</a></li>
			</ul>
		</div>
	</div>
</div>
<!-- cont -->
<div class="cont-login">
	<div class="main">
		<div class="login-container">
			<div class="title">
				<div class="left">注册用户</div>
				<div class="right">已有账号?<a href="/login">立即登录</a></div>
			</div>
			<div class="form form-register">
				<form action="/verify_register" method="post" onsubmit="return check_all()">
					@if(!empty($id))
					<input type="hidden" value="{{$id}}" name="invite_id">
					@endif
					<div class="form-group">
						<label for=""><span>*</span>用户名</label>
						<input type="text" class="form-control" name="user_name" id="user_name" onblur="check_user()"><span id="t_name"></span>
					</div>
					<div class="form-group">
						<label for=""><span>*</span>设置密码</label>
						<input type="password" class="form-control" name="pwd" id="pwd"  onblur="check_pwd()"><span id="t_pwd"></span>
					</div>
					<div class="form-group">
						<label for=""><span>*</span>确认密码</label>
						<input type="password" class="form-control" name="confirm_pwd" id="confirm_pwd" onblur="check_confirm()"><span id="t_confirm"></span>
					</div>
					<div class="form-group">
						<label for=""><span>*</span>手机号码</label>
						<input type="text" class="form-control" placeholder="请输入真实有效的手机号码" name="mobile" id="mobile" onblur="check_mobile()"><span id="t_mobile"></span>
					</div>
					<div class="form-group form-code">
						<label for="" class="left control-label"><span>*</span>验证码</label>
						<input type="text" class="left form-control" name="captcha" id="captcha" onblur="check_captcha()"><span id="t_captcha"></span>
						<div class="left code code-img">
							<img onclick="this.src='/captcha?'+ Math.random()"  src="/captcha">
						</div>
					</div>
					<div class="form-group form-code">
						<label for="" class="left control-label"><span>*</span>获取验证码</label>
						<input type="text" class="left form-control" placeholder="请输入短信验证码" name="news_captcha" id='news_captcha' onblur="check_news()"><span id="t_news"></span>
						<span class="left code"  id="f_captcha">获取短信验证码</span>
					</div>
					<div class="form-group">
						<label for="">邀请人</label>
						<input type="text" class="form-control" placeholder="请填写邀请人的手机号" name="invite_mobile" id="invite_mobile" onblur="check_invite()"><span id="t_invite"></span>
						<span class="left">（选填）</span>
					</div>
					<div class="form-group last">
						<input type="checkbox" onclick="check_agree()" id="agree"  checked/> <a href="/register_article" target="_blank">我已同意并阅读《央票通网站注册协议》</a><span id="t_agree"></span>
					</div>
					<input type="submit" value="注册" class="btn btn-register">
				</form>
				<div class="img-box"><img src="./resource/img/login_2.png" alt=""></div>
			</div>
		</div>
	</div>
</div>
<div class="footer">
	Copyright © 2016 央票通（中企汇科技（北京）股份有限公司） 版权所有；市场有风险，投资需谨慎，营造合法、诚信借贷环境。苏ICP备15005239号-2
</div>
</body>
</html>
<script src="./resource/js/jquery-1.11.3.min.js"></script>
<script>
	//验证用户名
	function check_user() {
		var username = document.getElementById('user_name').value;
		var reg = /^[\u4E00-\u9FFF\w]+$/;
		var status = false;
		if(username){
			if(username.length<10){
				if (reg.test(username)) {
					var ajax = new XMLHttpRequest();
					ajax.onreadystatechange = function () {
						if (ajax.readyState == 4) {
							if (ajax.responseText == 0) {
								document.getElementById("t_name").innerHTML = "<span style='color:green'>√</span>";
								status = true
							} else {
								document.getElementById("t_name").innerHTML = "<span style='color:red'>用户名已存在</span>";
							}
						}
					}
					//与服务器建立连接
					ajax.open('post', '/js_verify_register', false);
					ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
					//处理请求
					ajax.send('username=' + username);
					return status
				} else {
					document.getElementById('t_name').innerHTML = "<span style='color:red'>用户名有误</span>";
					return false
				}
			}else{
				document.getElementById('t_name').innerHTML = "<span style='color:red'>10个字符以内</span>";
				return false
			}
		}else{
			document.getElementById('t_name').innerHTML = "<span style='color:red'>*</span>";
			return false
		}

	}
	//验证密码
	function check_pwd(){
		var pwd = document.getElementById('pwd').value;
		var reg=/^\w{6,16}$/
		if(pwd){
			if(reg.test(pwd)) {
				document.getElementById("t_pwd").innerHTML = "<span style='color:green'>√</span>";
				return true
			}else{
				document.getElementById('t_pwd').innerHTML = "<span style='color:red'>密码长度六位到十六位</span>"
				return false
			}
		}else{
			document.getElementById('t_pwd').innerHTML = "<span style='color:red'>*</span>"
			return false
		}
	}
	function check_confirm(){
		var pwd = document.getElementById('pwd').value;
		var confirm_pwd = document.getElementById('confirm_pwd').value;
		if(confirm_pwd){
			if(pwd==confirm_pwd){
				document.getElementById('t_confirm').innerHTML = "<span style='color:green'>√</span>"
				return true
			}else{
				document.getElementById('t_confirm').innerHTML = "<span style='color:red'>俩次输入密码不一致</span>"
				return false
			}
		}else{
			document.getElementById('t_confirm').innerHTML = "<span style='color:red'>*</span>"
			return false
		}

	}

	//验证手机号
	function check_mobile(){
		var mobile = document.getElementById('mobile').value;
		var reg = /^1[34578]\d{9}$/;
		var status = false;
		if(mobile){
			if(reg.test(mobile)){
				var ajax = new XMLHttpRequest();
				ajax.onreadystatechange = function () {
					if (ajax.readyState == 4) {
						if (ajax.responseText == 0) {
							document.getElementById("t_mobile").innerHTML = "<span style='color:green'>√</span>";
							status=true
						} else {
							document.getElementById("t_mobile").innerHTML = "<span style='color:red'>该手机号已经注册</span>";
						}
					}
				}
				//与服务器建立连接
				ajax.open('post', '/js_verify_register', false);
				ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
				//处理请求
				ajax.send('mobile=' + mobile);
				return status;
			}else{
				document.getElementById('t_mobile').innerHTML = "<span style='color:red'>请输入正确的手机号</span>"
				return false
			}
		}else{
			document.getElementById('t_mobile').innerHTML = "<span style='color:red'>*</span>"
			return false
		}

	}
	//验证码验证
	function check_captcha(){
		var captcha =  document.getElementById('captcha').value;
		var status = false;
		if(captcha){
			var ajax = new XMLHttpRequest();
			ajax.onreadystatechange = function () {
				if (ajax.readyState == 4) {
					if (ajax.responseText == 1) {
						document.getElementById("t_captcha").innerHTML = "<span style='color:green'>√</span>";
						status = true
					} else {
						document.getElementById("t_captcha").innerHTML = "<span style='color:red'>验证码错误</span>";
					}
				}
			}
			//与服务器建立连接
			ajax.open('post', '/js_verify_register', false);
			ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			//处理请求
			ajax.send('captcha=' + captcha);
			return status
		}else{
			return false;
		}
	}

	//获取短信验证码

	$('#f_captcha').bind('click',function foo(){
		var mobile = document.getElementById('mobile').value;
		var captcha = document.getElementById('captcha').value;
		var reg = /^1[34578]\d{9}$/
		if(reg.test(mobile)) {
			if(check_mobile()){
				if(check_captcha()) {
					var wait = 60;
					var int = function fetch_captcha() {
						if (wait == 0) {
							$("#f_captcha").bind("click", foo);
							$('#f_captcha').html('获取验证码');
							clearInterval(a)
							wait = 60;
						}
						else {
							$('#f_captcha').unbind("click", foo);
							$('#f_captcha').html("重新发送(" + wait + ")");
							wait--;
						}
					}
					var a = setInterval(int, 1000);
					$.ajax({
						url: "/verify_news",
						type: "POST",
						data: "mobile=" + mobile,
						success: function (msg) {
							if (msg == 10000) {
								$("#t_news").html("<span style='color:green'>验证码发送成功,10分钟内输入有效</span>");
							}else if(msg == 160040){
								$("#t_news").html("<span style='color:red'>您当日验证码发送次数过多</span>");
								window.clearInterval(a);//停止计时器
								$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
								$(".form-code span.code").html("获取短信验证码");
								return false;
							}else{
								$("#t_news").html("<span style='color:red'>验证码发送错误</span>");
								window.clearInterval(a);//停止计时器
								$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
								$(".form-code span.code").html("获取短信验证码");
								return false;
							}
						}
					});
				}else{
					document.getElementById('t_captcha').innerHTML = "<span style='color:red'>验证码错误</span>"
					return false
				}
			}else{
				document.getElementById('t_mobile').innerHTML = "<span style='color:red'>该手机号已经注册</span>"
				return false
			}
		}else{
			document.getElementById('t_mobile').innerHTML = "<span style='color:red'>请输入正确的手机号</span>"
			return false
		}
	})


	//短信验证
	function check_news(){
		var news_captcha = document.getElementById('news_captcha').value;
		var mobile = document.getElementById('mobile').value;
		var status = false;
		if(news_captcha){
			var ajax = new XMLHttpRequest();
			ajax.onreadystatechange = function () {
				if (ajax.readyState == 4) {
					if (ajax.responseText == 1) {
						document.getElementById("t_news").innerHTML = "<span style='color:green'>√</span>";
						status = true
					}else if(ajax.responseText == 2){
						document.getElementById("t_news").innerHTML = "<span style='color:red'>验证码已过期</span>";
					}else{
						document.getElementById("t_news").innerHTML = "<span style='color:red'>验证码错误</span>";
					}
				}
			}
			//与服务器建立连接
			ajax.open('post', '/js_verify_register', false);
			ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			//处理请求
			ajax.send('news_captcha=' + news_captcha + '&mobile=' +mobile);
			return status
		}else{
			document.getElementById('t_news').innerHTML = "<span style='color:red'>*</span>";
			return false;
		}

	}

	//邀请人手机号验证
	function check_invite(){
		var invite_mobile = document.getElementById('invite_mobile').value;
		var reg = /^1[34578]\d{9}$/
		var status = false;
		if(invite_mobile){
			if(reg.test(invite_mobile)){
				var ajax = new XMLHttpRequest();
				ajax.onreadystatechange = function () {
					if (ajax.readyState == 4) {
						if (ajax.responseText == 0) {
							document.getElementById("t_invite").innerHTML = "<span style='color:red'>该手机号不存在</span>";
						} else {
							document.getElementById("t_invite").innerHTML = "<span style='color:green'>手机号可用</span>";
							status = true
						}
					}
				}
				//与服务器建立连接
				ajax.open('post', '/js_verify_register', false);
				ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
				//处理请求
				ajax.send('invite_mobile=' + invite_mobile);
				return status;
			}else{
				document.getElementById('t_invite').innerHTML = "<span style='color:red'>请输入正确的手机号</span>";
				return false
			}
		}else{
			document.getElementById('t_invite').innerHTML = "";
			return true;
		}
	}
	//复选框
	function check_agree()
	{
		var agree = document.getElementById('agree');
		if(agree.checked){
			document.getElementById('t_agree').innerHTML = "<span style='color:green'>√</span>";
			return true
		}else{
			document.getElementById('t_agree').innerHTML = "<span style='color:red'>*</span>";
			return false
		}
	}

	//检测全部
	function check_all(){
		return (check_user()&&check_pwd()&&check_confirm()&&check_mobile()&&check_news()&&check_captcha()&&check_invite()&&check_agree())
	}

</script>